<template>
  <div class="bottom">
    <!-- <div class="top">
      <img
        src="https://pic.cdfgsanya.com/assets/upload/visual/1250b774c5c8870103b2339dc0d82003.png"
        alt=""
      />
      <p>清仓特卖</p>
    </div> -->
    <div v-for="(v, index) in arr" :key="index" class="xia">
      <div class="xias">
        <img :src="v.img" alt="" />
        <p class="new">￥{{ v.newprice }}</p>
        <p class="xiahua">￥<s>{{ v.oldprice }}</s></p>
      </div>
    </div>
  </div>
</template>

<script>
import serviceAxios from "../../../../src/utils/service";
export default {
  data() {
    return {
      time: 30 * 60 * 60 * 1000,
      arr: [],
    };
  },
  mounted() {
    serviceAxios({
      url: "http://localhost:3000/ClearanceSale",
      method: "get",
    }).then((res) => {
      res.data.forEach((element) => {
        this.arr.push(element);
      });
    });
  },
};
</script>

<style scoped>
.bottom {
  width: 360px;
  height: 200px;
  display: flex;
  overflow: auto;
  flex-wrap: nowrap;
  background: white;
}
.bottom .top {
  height: 25px;
  width: 375px;
  background: white;
  display: flex;

  
}

 .bottom .xia {
  width: 25%;
  display: flex;
  /* overflow: auto;
  flex-wrap: nowrap; */
 /* background-color: yellow; */
 margin-top: 20px;
} 
.bottom .xia .xias{
  display: flex;
  flex-direction: column;
  width: 25%;
}
.bottom .xia .xias .new {
  font-size: 14px;
  margin-top: 10px;
}
.bottom .xia .xias .xiahua{
  color: gray;
  font-size: 12px;
  margin-top: 5px;
}
.bottom .top img {
  width: 20px;
  height: 20px;
}
.bottom div img {
  width: 90px;
  height: 90px;
}
.seckill .bottom div p {
  font-size: 10px;
  color: red;
}
</style>